<template>
    <div>
        <div class="box">
            <h2>
                <span>姓名:王小虎</span>
                &nbsp;
                <span>班级:JAVA87</span>
                &nbsp;
                <span>难度:87%</span>
                &nbsp;
                <span>总分:100</span>
                &nbsp;
            </h2>
            <div>
                <p><b>WEB开发中常用开发工具有?</b> <span class="score">2分</span></p>
                <div class="gray">考生回答</div>
                <el-input type="text" style="width: 400px;" :value="stude"></el-input>
                <div class="gray">参考答案</div>
                <div class="black">Vscode，webstorm，Hbuider</div>
                <el-input type="text" style="width: 100px; margin-right: 30px;" v-model.number="score" placeholder="输入分数"
                    maxlength="1" oninput="value=value.replace(/[^0-9.]/g,'')"></el-input>
                <el-button type="primary">打分</el-button>
                <hr style="width: 40%; margin: 20px 0;">
            </div>
            <div>
                <p><b>WEB开发中常用开发工具有?</b> <span class="score">2分</span></p>
                <div class="gray">考生回答</div>
                <el-input type="text" style="width: 400px;" :value="stude"></el-input>
                <div class="gray">参考答案</div>
                <div class="black">Vscode，webstorm，Hbuider</div>
                <el-input type="text" style="width: 100px; margin-right: 30px;" v-model.number="score" placeholder="输入分数"
                    maxlength="1" oninput="value=value.replace(/[^0-9.]/g,'')"></el-input>
                <el-button type="primary">打分</el-button>
                <hr style="width: 40%; margin: 20px 0;">
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            stude: 'pc,ai,c4d',
            score: ''
        }
    }

}
</script>

<style lang="less" scoped>
h2 {
    margin-top: 0;
}

h1 {
    text-align: left;
    padding-left: 10px;
}

.box {
    text-align: left;
    padding: 5px 20px;
}

.gray {
    font-size: 13px;
    color: gray;
    margin: 6px 0;
}

.black {
    margin: 6px 0;
    font-size: 13px;
}

.score {
    padding: 5px 20px;
    background: #909399;
    font-size: 12px;
    color: #fff;
    margin-left: 70px;
}
</style>